<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

  <head>
    <title>org.brophy.js Library Demos</title>
    <script type="text/javascript">MochiKit = {__export__: false};</script>
    <script type="text/javascript" src="../MochiKit/MochiKit.js"></script>
    <script type="text/javascript" src="../org/brophy/js/constant.js"></script>
    <script type="text/javascript" src="../org/brophy/js/util.js"></script>
    <script type="text/javascript" src="../org/brophy/js/ajax.js"></script>
    <script type="text/javascript" src="../org/brophy/js/array.js"></script>
    <script type="text/javascript" src="../org/brophy/js/select.js"></script>
    <script type="text/javascript" src="../org/brophy/js/event.js"></script>
    <script type="text/javascript" src="./org.brophy.js.demo.js"></script>
    <link rel="stylesheet" type="text/css" href="../org/brophy/css/org.brophy.js.css"/>
    <link rel="stylesheet" type="text/css" href="org.brophy.js.demo.css"/>

    <script type="text/javascript">
    //<![CDATA[
    
      // Global namespace to store all demo functions
      obj = {};

      window.onload = function()
      {
        org.brophy.js.demo.drawPageHeader("util");

        var jsCode, htmlCode, instructions;
        
        /********************************************
         * org.brophy.js.util.toggleDisplay 
         ********************************************/ 
        htmlCode = 
          "<input type='button' value='Show/Hide!'                       \n" + 
          "  onclick='org.brophy.js.util.toggleDisplay(\"showHideId1\");'/>" + 
          "\n\n"                                                             + 
          "<div id='showHideId1' class='obj_b obj_border obj_pad'>       \n" +
          "  Now you see me!  Now you don't!                             \n" + 
          "</div>                                                          " + 
          "\n\n<br/><br/>\n\n"                                               +
          "<input type='button' value='Fancy Show/Hide!'                 \n" + 
          "   onclick='org.brophy.js.util.toggleDisplay(\"showHideId2\", true);'/>" + 
          "\n\n"                                                             + 
          "<div id='showHideId2' class='obj_b obj_border obj_pad'>       \n" +
          "  Now you see me!  Now you don't!                             \n" + 
          "</div>                                                         ";
             
        instructions = 
          "Press the buttons below to show and hide the divs.";
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.toggleDisplay",
                             "demo_obj_util_toggleDisplay",
                             htmlCode,
                             null,
                             instructions);  

        /********************************************
         * org.brophy.js.util.getLeft
         ********************************************/ 
        jsCode = 
          "obj.testGetLeft = function(elem)                                    \n" + 
          "{                                                             \n" + 
          "  alert(org.brophy.js.util.getLeft(elem));                    \n" +
          "}                                                             \n";

        htmlCode = 
          "<div class='floating' onclick='obj.testGetLeft(this);'>       \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating' onclick='obj.testGetLeft(this);'>       \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating' onclick='obj.testGetLeft(this);'>       \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n";
             
        instructions = 
          "Click each of the DIV's below to see the number of pixels the " + 
          "left edge is from the left edge of the document."
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getLeft",
                             "demo_obj_util_getLeft",
                             htmlCode,
                             jsCode,
                             instructions);  


        /********************************************
         * org.brophy.js.util.getTop
         ********************************************/ 
        jsCode = 
          "obj.testGetTop = function(elem)                               \n" + 
          "{                                                             \n" + 
          "  alert(org.brophy.js.util.getTop(elem));                     \n" +
          "}                                                             \n";

        htmlCode = 
          "<div class='floating clear'                                   \n" + 
          "     onclick='obj.testGetTop(this);'>                         \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating clear'                                   \n" + 
          "     onclick='obj.testGetTop(this);'>                         \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating clear'                                   \n" + 
          "     onclick='obj.testGetTop(this);'>                         \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n";
             
        instructions = 
          "Click each of the DIV's below to see the number of pixels the " + 
          "top edge is from the top of the document."
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getTop",
                             "demo_obj_util_getTop",
                             htmlCode,
                             jsCode,
                             instructions);  

        /********************************************
         * org.brophy.js.util.getRelativeLeft
         ********************************************/ 
        jsCode = 
          "obj.testGetRelativeLeft = function(elem)                                    \n" + 
          "{                                                             \n" + 
          "  alert(org.brophy.js.util.getRelativeLeft(elem));            \n" +
          "}                                                             \n";

        htmlCode = 
          "<div class='floating' onclick='obj.testGetRelativeLeft(this);'>\n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating' onclick='obj.testGetRelativeLeft(this);'>\n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating' onclick='obj.testGetRelativeLeft(this);'>\n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n";
             
        instructions = 
          "Click each of the DIV's below to see the number of pixels the " + 
          "left edge is from the left edge of the current viewport."
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getRelativeLeft",
                             "demo_obj_util_getRelativeLeft",
                             htmlCode,
                             jsCode,
                             instructions);  


        /********************************************
         * org.brophy.js.util.getRelativeTop
         ********************************************/ 
        jsCode = 
          "obj.testGetRelativeTop = function(elem)                       \n" + 
          "{                                                             \n" + 
          "  alert(org.brophy.js.util.getRelativeTop(elem));             \n" +
          "}                                                             \n";

        htmlCode = 
          "<div class='floating clear'                                   \n" + 
          "     onclick='obj.testGetRelativeTop(this);'>                 \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating clear'                                   \n" + 
          "     onclick='obj.testGetRelativeTop(this);'>                 \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n" +
          "<div class='floating clear'                                   \n" + 
          "     onclick='obj.testGetRelativeTop(this);'>                 \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n";
             
        instructions = 
          "Click each of the DIV's below to see the number of pixels the " + 
          "top edge is from the top of the current viewport."
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getRelativeTop",
                             "demo_obj_util_getRelativeTop",
                             htmlCode,
                             jsCode,
                             instructions);  

        /********************************************
         * org.brophy.js.util.getScrollX
         ********************************************/ 
        jsCode = null;
        htmlCode = 
          "<button onclick='alert(org.brophy.js.util.getScrollX());'>    \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n";
             
        instructions = 
          "Click the button below for the number of pixels scrolled " + 
          "horizontally";
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getScrollX",
                             "demo_obj_util_getScrollX",
                             htmlCode,
                             jsCode,
                             instructions);  

        /********************************************
         * org.brophy.js.util.getScrollY
         ********************************************/ 
        jsCode = null;
        htmlCode = 
          "<button onclick='alert(org.brophy.js.util.getScrollY());'>    \n" +
          "  Click me!                                                   \n" +
          "</div>                                                        \n";
             
        instructions = 
          "Click the button below for the number of pixels scrolled " + 
          "vertically";
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getScrollY",
                             "demo_obj_util_getScrollY",
                             htmlCode,
                             jsCode,
                             instructions);  

        /********************************************
         * org.brophy.js.util.getWindowHeight
         ********************************************/ 
        jsCode = null;
        htmlCode = 
          "<button onclick='alert(org.brophy.js.util.getWindowHeight());'>\n" +
          "  Click me!                                                    \n" +
          "</div>                                                         \n";
             
        instructions = 
          "Click the button below for the window height in pixels";
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getWindowHeight",
                             "demo_obj_util_getWindowHeight",
                             htmlCode,
                             jsCode,
                             instructions);  


        /********************************************
         * org.brophy.js.util.getWindowWidth
         ********************************************/ 
        jsCode = null;
        htmlCode = 
          "<button onclick='alert(org.brophy.js.util.getWindowWidth());'>\n" +
          "  Click me!                                                    \n" +
          "</div>                                                         \n";
             
        instructions = 
          "Click the button below for the window width in pixels";
   
        org.brophy.js.demo.drawDemoSection(
                             "org.brophy.js.util.getWindowWidth",
                             "demo_obj_util_getWindowWidth",
                             htmlCode,
                             jsCode,
                             instructions);  

      }
  
    //]]>
    </script>
  
  </head> 
  
  <body>
  </body>
  
</html>
  
  
  
